const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpackConfig = require('./base.config');
const multipleEntry = require('./multipleEntry');

const port = 3001;

webpackConfig.mode = 'development';

webpackConfig.module.rules.push({
    test: /\.css$/,
    exclude: /node_modules/,
    use: ['style-loader', {
        loader: 'css-loader',
        options: {
            importLoaders: 2,
        },
    }, 'postcss-loader'],
});
/*
webpackConfig.output = {
    publicPath: '../dist',
    filename: '[name].js',
}; */

multipleEntry.pages.forEach((page) => {
    webpackConfig.plugins.push(
        new HtmlWebpackPlugin({
            title: page.title,
            filename: page.filename,
            template: page.template,
            inject: true,
            hash: true,
            chunks: ['polyfill', page.chunk],
            minify: {
                removeComments: true, // 移除HTML中的注释
                collapseWhitespace: true,
                removeEmptyAttributes: true,
            },
            chunksSortMode: 'dependency'
        })
    );
});

webpackConfig.plugins.push(
    new webpack.DefinePlugin({
        'process.env': {
            NODE_ENV: JSON.stringify('development'),
        },
    }),
    new webpack.HotModuleReplacementPlugin(),
);

module.exports = {
    mode: 'development',
    entry: webpackConfig.entry,
    output: {
        publicPath: '/',
        path: path.join(__dirname, '../dist'),
        filename: '[name].js',
        chunkFilename: '[name].bundle.js',
    },
    // 解析模块
    resolve: webpackConfig.resolve,
    module: webpackConfig.module,

    plugins: webpackConfig.plugins,
    devtool: 'eval-source-map',
    devServer: {
        hot: true,
        open: true,
        quiet: true,
        inline: true,
        overlay: true,
        compress: true,
        useLocalIp: true,
        contentBase: path.join(__dirname, '../dist'),
        historyApiFallback: true,
        publicPath: '/',
        proxy: {
            '/api': {
                target: 'http://127.0.0.1:3000',
                changeOrigin: true,
                pathRewrite: { '^/api': '' },
            },
        },
        host: '0.0.0.0',
        port,
    },
};
